<template>
    <view class="leaveRequestList">
        <ScNavBar @click="backNav">请假审核</ScNavBar>
        <view
            class="flex-col--c"
            :style="{ height: `calc(100vh - ${navHeight})` }"
        >
            <u-tabs
                customClass="sc-tabs"
                line-width="50"
                line-height="5"
                style="width: 100vw"
                @click="clickTab"
                :list="[
                    {
                        name: '待审批',
                        value: 0,
                    },
                    {
                        name: '已通过',
                        value: 0,
                    },
                    {
                        name: '被否决',
                        value: 0,
                    },
                ]"
            >
            </u-tabs>
            <view class="scroll-view-box">
                <!-- loading -->
                <sc-loading :loading="loading"></sc-loading>
                <scroll-view
                    scroll-y
                    class="scroll-view-box"
                    style="height: 100%"
                >
                    <view class="request-list">
                        <view
                            class="request-item flex-row-sb"
                            v-for="item in 10"
                            :key="item.id"
                        >
                            <view class="left flex-col">
                                <text class="name"
                                    >张胜男{{ varCss.color }}</text
                                >
                                <text class="day-num">请假天数:三天</text>
                            </view>
                            <view class="right"> 审批中 </view>
                        </view>
                    </view>
                    <ScLoadMore :status="status" :is-data="true"></ScLoadMore>
                </scroll-view>
            </view>
        </view>
    </view>
</template>

<script>
export default {
    name: "leaveRequestList",
    data() {
        return {
            loading: true,
        };
    },
    created() {
        setTimeout(() => {
            this.loading = false;
        }, 2000);
    },
    methods: {
        // 点击tab触发
        clickTab({ index }) {
            console.log("index", index);
        },
    },
};
</script>
<style lang='scss' scoped>
.leaveRequestList {
    .scroll-view-box {
        flex: 1;
        overflow: hidden;
        width: 100%;

        .request-list {
            .request-item {
                padding: 20rpx 42rpx 0;
                min-height: 142rpx;
                border-top: 1px solid #eeeeee;

                .left {
                    font-size: 28rpx;

                    .name {
                        color: #333333;
                    }

                    .day-num {
                        margin-top: 12rpx;
                        color: #999999;
                    }
                }

                .right {
                    color: #415a6b;
                    font-size: 26rpx;
                }
            }
        }
    }
}
</style>
